<template>
	<view class="template-invoice-add gray-content">
		<view style="height: 40rpx;"></view>
		<view class="add_content">
			<tn-form :model="form" ref="form" :labelWidth="180" labelAlign="center" :errorType="['toast']">
				<tn-form-item label="发票名称" prop="invoiceName">
					<tn-input v-model="form.invoiceName" placeholder="发票名称" />
				</tn-form-item>
				<tn-form-item label="单位税号" prop="invoiceDutyNo">
					<tn-input v-model="form.invoiceDutyNo" placeholder="单位税号" />
				</tn-form-item>
				<tn-form-item label="发票抬头" prop="invoiceHead">
					<tn-input v-model="form.invoiceHead" placeholder="发票抬头" />
				</tn-form-item>
				<tn-form-item label="注册地址" prop="address">
					<tn-input v-model="form.address" placeholder="注册地址" />
				</tn-form-item>
				<tn-form-item label="开户银行" prop="openBank">
					<tn-input v-model="form.openBank" placeholder="开户银行" />
				</tn-form-item>
				<tn-form-item label="银行账号" prop="bankNo">
					<tn-input v-model="form.bankNo" placeholder="银行账号" />
				</tn-form-item>
				<tn-form-item label="注册电话" prop="tel" :borderBottom="false">
					<tn-input v-model="form.tel" placeholder="注册电话" />
				</tn-form-item>
			</tn-form>
		</view>
		<view class="tn-margin">
			<tn-button class="common-button add-button" width="100%" @click="add">提交</tn-button>
		</view>
	</view>
</template>

<script>
	import { save,getInfo } from '@/api/account/invoiceInfo';
	export default {
		data() {
			return {
				form: {
					invoiceName: '',
					invoiceDutyNo: '',
					invoiceHead: '',
					address: '',
					openBank: '',
					bankNo: '',
					tel: ''
				},
				rules: {
					invoiceName: [{
						required: true,
						message: '请输入发票名称',
						trigger: ['change', 'blur'],
					}],
					invoiceDutyNo: [{
						required: true,
						message: '请输入单位税号',
						trigger: ['change', 'blur'],
					}],
					invoiceHead: [{
						required: true,
						message: '请输入发票抬头',
						trigger: ['change', 'blur'],
					}]
				}
			}
		},
		mounted() {},
		computed: {},
		onLoad(option) {
			if (option.id) {
				this.getData(option.id);
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules);
		},
		methods: {
			getData(id) {
				getInfo(id).then(res => {
					this.form = res.result;
				});
			},
			add() {
				this.$refs.form.validate(valid => {
					if (valid) {
						save(this.form).then(res => {
							if (res.code == 200) {
								this.$common.msg('操作成功');
								this.$common.navigateBack();
							}
						});
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.template-invoice-add {
		height: 100vh;

		.add_content {
			height: max-content;
			background-color: #FFF;
			margin: 0 10rpx;
			padding: 0 10rpx;
		}
	}
</style>